<template>
	<view class="all-box">
		<myLoading v-show="isLogin == 1"></myLoading>	
		<view class="schedule-box">
			<view class="box-user-info" v-show="isLogin == 1">
				<image v-if="spInfo.spAvatar" class="username-image" :src="spInfo.spAvatar"></image>
				<image v-else class="username-image" src="https://image.nanjingtouyang.com/touy/2024/05/20/b528001914de4cfd8d6a619a413b3f16.png" mode=""></image>
				<view  class="user-info-name" v-if="spInfo.spName">{{ spInfo.spName }}</view>
				<view  class="user-info-name" v-else></view>
			</view>
			<view class="box-user-text">
				日程表
			</view>
		</view>
		<view class="schedule-box-view">
			<view class="view-box">
				<!-- :chooseDateList="list" -->
				<u-calendar v-if="isLogin" :mode="mode"  @custon-event="getChooseDate" @month-event="getChooseMonth"></u-calendar>
			</view>
		</view>
		
		<!-- 日程表 -->
		<view class="schedule-list">
			<view class="schedule-list-title">
				<view class="title-text">{{ dayText }}日程</view>
				<!-- <view class="title-text" v-else>{{ chooseDay }}日日程</view> -->
				<image class="title-icon" src="https://image.nanjingtouyang.com/touy/2024/05/16/939bcf04590f43049daabd92e975d6a5.png" mode=""></image>
			</view>
			
			<!-- 未登录 -->
			<view class="login-view" v-if="isLogin == 0">
				<image class="login-bg" src="https://image.nanjingtouyang.com/touy/2024/05/14/81f5b650a16348cbbd32a3d0a997b2bc.png"></image>
				<view class="login-text">教练，还没有登录哦～</view>
				<view class="login-button" @click="toLogin">立即登录</view>
			</view>
			
			<view v-else>
				<view class="have-none-view" v-if="dayListLength == 0">
					<image class="none-image" src="https://image.nanjingtouyang.com/touy/2023/11/2023110814245894940.png" mode=""></image>
					<view class="have-none-text">哎呀，暂无日程哦~</view>
				</view>
				<view class="schedule-list-box" v-else>
					<view class="schedule-list-item" v-for="(item, index) in dayList" :key="index"  @click="toYaoYueDetail(item)">
						<view class="item-top">
							<view class="time-view">
								<img class="time-view-icon" src="https://image.nanjingtouyang.com/touy/2024/02/19/980bedf319ee49909146843e3383ced9.png"/>
								<view class="place-text">
									{{item.aptScheduleLabel }}
								</view>
							</view>
							
							<view class="time-view">
								<img class="time-view-icon" src="https://image.nanjingtouyang.com/touy/2024/02/19/d208f94511994ece9bf721d4bdbb0e5f.png"/>
								<view class="place-text">
									{{ item.shopName || item.addr }}
								</view>
							</view>
							<view class="time-view">
								<img class="time-view-icon" src="https://image.nanjingtouyang.com/touy/2024/02/20/109b25998b22478abd91d8b43d8b9fb6.png"/>
								<view class="place-text">
									{{ item.distanceLabel }}
								</view>
							</view>
						</view>
						
						<view class="item-schedule-box">
							<view class="box-user-info">
								<image v-if="item.userAvatar" class="username-image" :src="item.userAvatar"></image>
								<image v-else class="username-image" src="https://image.nanjingtouyang.com/touy/2023/09/2023090515054870864.png" mode=""></image>
								<view class="user-info-name">{{ item.userName }}</view>
							</view>
							<view class="box-user-text">
								<text v-show="item.aptTimeLabel == '待开始'">{{ item.aptTimeLabel }}</text>
								<text v-show="item.aptTimeLabel == '进行中'" style="color: #E02020;">{{ item.aptTimeLabel }}</text>
								<text v-show="item.aptTimeLabel == '已结束'" style="color: #666666;">{{ item.aptTimeLabel }}</text>
							</view>
						</view>
						
					</view>
				</view>
			</view>
			
			
		</view>
		
	</view>
</template>

<script>
	import { qryAptWorkDay, qryAptWorkDayList } from '@/api/public.js'
	import { getMySpInfo } from '@/api/mine.js'
	export default {
		data() {
			return {
				mode: 'date',
				list: [],
			
				dayText: '今日',
				isLogin: '',
				spInfo:'',
				year: '',
				month: '',
				day: '',
				refreshTime: 0,
				dayList: '',
				dayListLength:''
				
			}
		},
		onLoad() {
			let now = new Date()
			
			this.year = now.getFullYear();
			this.month = now.getMonth() + 1; // 月份从0开始，需要加1
			this.day = now.getDate();
			uni.setStorageSync('firstLogin', true)
			
		},
		onShow() {
			if(uni.getStorageSync('spToken')) {
				this.isLogin = 1
				this.getSpInfo()
				if(uni.getStorageSync('firstLogin') == true) {
					// 登录之后，首次进入刷新
					this.getChooseDate(this.year + '-' + this.month + '-' + this.day)
					uni.setStorageSync('firstLogin', false)
				}
				
			} else {
				this.isLogin = 0
			}
		},
		methods: {
			getChooseDate(value, day) {
				if(value == this.year +'-' + this.month + '-' + this.day) {
					this.dayText = '今日'
				} else {
					this.dayText = day + '日'
				}
				qryAptWorkDayList({
					pageNum: 1,
					pageSize: 50,
					aptTimeDay: value,
					qryType: 11
				}).then(res => {
					this.dayList = res.data.data
					this.dayListLength = this.dayList.length
				})
				
			},
			getSpInfo() {
				getMySpInfo().then(res => {
					this.spInfo = res.data.data
				})
			},
			toLogin() {
				uni.navigateTo({
					url:'../../pages/login/index'
				})
			},
			toYaoYueDetail(item) {
				uni.navigateTo({
					url:'../../pages/yaoyue-detail/index?id='+ item.aptId
				})
			}
		}
	}
</script>

<style lang="scss">
	@import './schedule.scss';
</style>
